{% extends 'home/public/base.html' %}

{% block css %}
<link rel="stylesheet" type="text/css" href="/static/home/public/css/order.css">
<link rel="stylesheet" type="text/css" href="/static/home/public/css/order-app.css">
{% endblock %}

{% block con %}
<!-- 主内容区域 -->
<div class="mainbody order">
	<div class="container">
		<!-- 面包屑导航 -->
		<div class="crumbs col-xs-12 col-sm-12">
			<ol class="breadcrumb">
				<li class="hidden-xs hidden-sm"><a href="{% url 'index' %}">首页</a></li>
				<li class="hidden-xs hidden-sm"><a href="{% url 'index' %}">我的商城</a></li>
				<li class="active">我的订单</li>
			</ol>
		</div><!-- 面包屑导航 E-->
		
		<div class="main clearfix">
			<!-- 左侧导航 -->
			<div class="left-nav f-fl col-md-4 hidden-xs hidden-sm">
				<div class="nav-main">
					<a href="javascript:;" class="type-title"><span class="glyphicon glyphicon-list-alt" aria-hidden="true"></span>订单中心</a>
					<a href="{% url 'myorder' %}" class="ml active" >我的订单</a>

					<a href="javascript:;" class="type-title"><span class="glyphicon glyphicon-user" aria-hidden="true"></span>个人中心</a>
					<a href="{% url 'member' %}" class="ml " >地址管理</a>

				</div>
			</div><!-- 左侧导航 E-->
			<!-- 右侧内容展示 -->
			<div class="right-content f-fr col-md-8 col-xs-12 col-sm-12">
				<div class="order-main">
					<div class="type-tab-btn">
						<a href="javascript:;" class="allOrder active col-20" data-type="-1">全部订单</a><i class="line hidden-xs hidden-sm"></i>

					</div>
					<div class="list-head hidden-xs hidden-sm">
                    <ul class="clearfix">
                        <li class="w50">
                            <select id="checkType" class="check-type">
                                <option value="0">近三个月的订单</option>
                                <option value="1">全部订单</option>
                            </select>
                            订单明细
                        </li>
                        <li class="w125">售后</li>
                        <li class="w125">金额</li>
                        <li class="w125">状态</li>
                        <li class="w125">操作</li>
                    </ul>
					</div>
					<div id="tableList" class="type-contain ui-load-container">
						<div class="ui-load-content"><input id="unPayNum" value="0" type="hidden">
							<table class="orderItem">
								<tbody>

									{% for v in orders %}
									<tr class="trHead hidden-xs hidden-sm">
										<td colspan="4" class="title clearfix">
										  <div class="f-fl">下单时间：<span class="time">{{ v.addtime|date:'Y-m-d H:i:s' }}</span>订单号：<span class="orderNumber">{{ v.id }}</span>
										  </div>
										</td>
									</tr>
									<tr class="list-box b-l b-r b-b">
										<td class="list b-r j-iamCart">
											<div class="cart-wrap j-CartWrap">
												<div class="shop j-shop j-amLight">
													{% for vv in v.orderinfo_set.all %}
													<div class="item b-t clearfix j-item j-iamMain">
														<a class="productDetail nameWidth col-xs-4 col-sm-4" href="{% url 'info' vv.gid.id %}" target="_blank">
															<img src="{{ vv.gid.pic }}" class="f-fl">
														</a>
														<div class="describe f-fl col-xs-8 col-sm-8">
															<div class="vertic clearfix">
																<span class="clearfix">
																	<a class="productDetail nameWidth" href="{% url 'info' vv.gid.id %}" target="_blank">
																	<i>{{ vv.gid.title }}</i> <i class="pro-d"></i></a>
																	<p>
																	￥{{ vv.gid.price }} x {{ vv.num }}
																	</p>
																</span>
															</div>
														</div>
														<input class="orderSn" value="51090244361541573081" type="hidden">
														<input class="isCart" value="1" type="hidden">
														<input class="orderSnSon" value="21090244361541575081" type="hidden">
													</div>
													{% endfor %}
													

												</div>
											</div>
										</td>
										<!-- 金额 -->
										<td class="b-r w125 center price b-t hidden-xs hidden-sm">
											<div class="priceDiv">
												{{ v.totalprice }}
											</div>
										</td>
										<!-- 状态 -->
										<td class="b-r w125 center state b-t hidden-xs hidden-sm">
											<div class="stateDiv">
												<div>
													{% if v.status == 1 %}
													待付款<br>
													{% elif v.status == 2 %}
													待发货<br>
													{% elif v.status == 3 %}
													待收货<br>
													{% elif v.status == 4 %}
													已完成<br>
													{% elif v.status == 5 %}
													已取消<br>
													{% endif %}
												</div>
											</div>
										</td>
										<!-- 详情 -->
										<td class="w125 center opreat b-t hidden-xs hidden-sm">
											<ul>
												<li class="more"><a href="{% url 'myorderinfo' v.id %}" target="_blank">查看详情</a></li>
											</ul>
										</td>
									</tr>
									{% endfor %}
									
								</tbody>
							</table>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>	
</div>
<!-- 主内容区域 E-->

{% endblock %}


{% block js %}
<script type="text/javascript">

//回顶部
backTop();
//顶部导航鼠标经过出现内容
topNav();
//登录图片鼠标经过
topLogin();

 // 数量增加减少
function addMin(){
	// 减少
	$('.vm-minus').click(function(){
		
	  var n=$(this).next().find('.mz-adder-input').val();
	  var num=parseInt(n)-1;
	  if (num<=1) 
	  	num = 1;
	  if(num<=1){ 
	    $('.vm-minus').addClass('disabled');
	    $(this).next().find('.mz-adder-input').val(1);
	  }else{
	    $('.vm-minus').removeClass('disabled');
	    $(this).next().find('.mz-adder-input').val(num);
	  }
	  
		// 获取当前商品id 
		var gid = $(this).parents('.cart-product').attr('gid')
		// 当前商品对象的总结标签
		var a = $(this)
		$.get('{% url "cartclearnumreduce" %}',{gid:gid,num:num},function(data){
			if(data['code']==0){
				// 计算成功,改变页面信息
				a.parents('.cart-product').find('.total').text(data['total']);
				totalPrice();
				
				// location.href=location.href
		
			}else{
				// 输出提示信息
				alert(data['msg'])
			}
		},'json');
	})
  //增加
	$('.vm-plus').click(function(){
		var n=$(this).prev().find('.mz-adder-input').val();
		var num=parseInt(n)+1;
		// if(num>=5)
		// 	num = 5;
		if(num>1){ $('.vm-minus').removeClass('disabled');}
		// if(num>5){ return;}
		$(this).prev().find('.mz-adder-input').val(num);

		// 获取当前商品id 
		var gid = $(this).parents('.cart-product').attr('gid')
		// 当前商品对象的总结标签
		var a = $(this)
		$.get('{% url "cartclearnumadd" %}',{gid:gid,num:num},function(data){
			if(data['code']==0){
				// 计算成功,改变页面信息
				a.parents('.cart-product').find('.total').text(data['total'])
				
				// location.href=location.href
				totalPrice();
		
			}else{
				// 输出提示信息
				alert(data['msg'])
			}
		},'json');
	});
}// 数量增加减少E

addMin();

// 删除购物车中的相应商品 (包括页面和session中的数据)
$('.glyphicon-remove').click(function(){
	// 获取当前商品id
	var gid = $(this).parents('.cart-product').attr('gid')
	var item =  $(this).parents('.cart-product')
	// 发送ajax
	$.get('{% url "cartlistdel" %}',{gid:gid},function(data){
		if(data['code'] == 0){
			// 删除页面中相应的商品
			item.remove()
			totalPrice();
		}
	},'json');
});



// 计算选中商品的总价
function totalPrice(){
	
}



//选择框操作
function allSelect(){
  var aee = false;
  var see = false;
  // 全选
  $('.JSelectAll .mz-checkbox').click(function(){
    if(aee==false){
      $(this).addClass('checked');
      $('.cart-col-select .mz-checkbox').addClass('checked');
      aee = true;
      totalPrice();

    }else if(aee==true){
      $(this).removeClass('checked');
      $('.cart-col-select .mz-checkbox').removeClass('checked');
      aee = false;
      totalPrice();
    }
  })

  //单选
  $('.cart-col-select .mz-checkbox').click(function(){
    if(see==false){
      $(this).addClass('checked');
      see = true;
      totalPrice();
      
    }else if(see==true){
      $(this).removeClass('checked');
      see = false;
      totalPrice();
    }
  })
}

allSelect();



// 商品总数计算
function totalPrice(){
	// 价格小计
	var total = 0;
	// 选中商品的id组成数组
	var ids =[];
	// 选中商品的个数
	var totalCount = 0;
	// 获取已经选择的元素
	
	$('.cart-merchant-body .checked').each(function(){
		p = $(this).parents('tr').find('.total').text();
		total += Number(p);

		c = $(this).parents('tr').find('.mz-adder-input').val();
		totalCount += Number(c);

		ids.push($(this).attr('gid'));
	});

	$('#totalPrice').text(total);
	$('#totalCount').text(totalCount);


	return ids;
}


// 去结算
$('#cartSubmit').click(function(){
	// 得到结算产品的id
	ids = totalPrice();
	if (ids.length == 0){
		alert('请选择购买的产品')
	}else{
		location.href="/order/confirm/?ids="+ids.join(',')
	}

});


// 给所有的地址 绑定单击事件
$('.address-items').click(function(){
	// 给当前选择的地址添加样式
	$(this).css('border','2px solid red').siblings().css('border','2px dashed black')
	// 把当前选择的地址id添加到表单中
	aid = $(this).attr('aid')
	$('input[name=adsressid]').val(aid)
});

// 把默认地址添加到表单中
aid = $('.address-items[ischecked=1]').attr('aid')
$('input[name=addressid]').val(aid)

// 表单事件，确认是否选择了地址
$('createFrom').submit(function(){
	// 确认是否选择了地址
	aid = $('input[name=addressid]').val()
	if(!aid){
		alert('请选择收货地址')
		return false;
	}
});


</script>
{% endblock %}